<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>订单确认</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/style.css" />
		<link rel="stylesheet" href="../css/iconfont3.css" />
		<link rel="stylesheet" href="../css/iconfont6.css" />
		<link rel="stylesheet" href="../../css/title.css" />
		
		<style>
			.mui-content{margin:0px 0px;}
			.mui-card .mui-table-view .mui-table-view-cell{background-color:#333;}
			.mui-table-view-cell:after{height:0;}
			.mui-table-view-cell{margin-bottom:10px;}
			.mui-card .mui-table-view{background-color:#1a1a1a;}
			.mui-card .mui-table-view a{color:#f0f0f0;}
			.mui-card .mui-table-view a.mui-active{background:#444;}
			.home_top{
				height: 70px;
				background:#05508A;
			}
			.mui-bar-nav~.mui-content{
				padding-top: 70px;
			}
			.home_top .mui-title span{
				width: 75%;
				height: 35px;
				background: black;
				color: rgb(250,175,58);
				line-height: 35px;
			}
			.home_top .mui-title{
				position: absolute;
				top: 10px;
			}
			.home_top a.mui-action-back{
				color: black;
			}
			.shop-order-address{
				width: 100%;
				height: auto;
				margin-top: 70px;
				background: rgb(51,51,51);
				padding: 10px 10px;
				position: relative;
			}
			.shop-order-address span{
				background: rgb(250,175,58);
				font-size: 18px;
				border-radius:20px;
				color: black;
			}
			.shop-order-address p{
				color: rgb(250,175,58);
				margin: 0px;
				font-size: 14px;
				width: 90%;
			}
			.shop-order-address i{
				position: absolute;
				right: 10px;
				top: 50%;
				margin-top: -12px;
			}
			.shop-order-main{
				width: 100%;
				height: auto;
				background: rgb(51,51,51);
				padding: 5px 10px 5px 10px;
				margin-top: 10px;
				position: relative;
			}
			.shop-order-main img{
				width: 30%;
				margin: 0;
				padding: 0;
				float: left;
			}
			.shop-order-name{
				width: 70%;
				float: left;
			}
			.shop-order-name h2{
				font-size: 16px;
				font-weight: normal;
				color: white;
				width: 67%;
				float: left;
				margin-left: 3%;
			}
			.shop-order-name span{
				font-size: 22px;
				width: 30%;
				float: left;
				text-align: right;
				line-height: 38px;
				color: rgb(240,90,35);
			}
			.mui-numbox{
				position: absolute;
				right: 10px;
				bottom: 10px;
				height: 28px;
				width: 90px;
				padding: 0 28px;
				background: none;
				border: none;
			}
			.order-numbox{
				width: 90px;
				height: 28px;
				position: absolute;
				right: 10px;
				bottom: 10px;
			}
			.order-num-{
				display: block;
				width: 28px;
				height: 28px;
				text-align: center;
				line-height: 26px;
				margin: 0px;
				padding: 0px;
				float: left;
				border: none;
				background: rgb(204,204,204);
				color: black;
				font-size: 22px;
				border-radius: 15px;
			}
			.order-numbox .order-num-input{
				width: 34px;
				height: 28px;
				text-align: center;
				line-height: 28px;
				margin: 0px;
				padding: 0px;
				float: left;
				border: none;
				background: none;
				color: black;
				font-size: 22px;
				border-radius: 15px;
				color: white;
			}
			.order-num-add{
				display: block;
				width: 28px;
				height: 28px;
				text-align: center;
				line-height: 26px;
				margin: 0px;
				padding: 0px;
				float: left;
				border: none;
				background: rgb(204,204,204);
				color: black;
				font-size: 22px;
				border-radius: 15px;
			}
			.shop-order-remarks{
				margin-top: 10px;
				background: rgb(51,51,51);
				padding: 5px 10px;
				color: white;
				height: 100px;
			}
			.order-bottom{
				position: fixed;
				width: 100%;
				height: 60px;
				left: 0px;
				bottom: 0px;
				background: rgb(26,26,26);
				z-index: 999;
				border-top: 1px solid rgb(32,32,32);
			}
			.order_left{
				width: 50%;
				height: 60px;
				float: left;
			}
			.order_left p{
				line-height: 60px;
				text-align: right;
				margin-right: 11px;
				font-size: 20px;
				color: rgb(240,90,35);
			}
			.order_right{
				width: 50%;
				height: 60px;
				float: left;
			}
			.order_right a{
				display: block;
				width: 95%;
				height: 40px;
				margin-top: 10px;
				padding-top: 5px;
				background: -webkit-linear-gradient(top,#fbed21,#fab538);
				text-align: center;
				border-radius: 10px;
			}
			.order_right p{
				color: black;
				font-size: 20px;
				font-family: "微软雅黑";
				line-height: 16px;
			}
			.order_right span{
				font-size: 10px;
			}
			
			input[type=password]{
				    border-radius: 0;
			}
			
			#keyboard{
				height:230px;
				background-color:rgb(245,245,245);
				bottom: 0;
				width:100%;
				padding:0;
				position: fixed;
			    z-index: 10;
			    right: 0;
			    left: 0;
			    border-top:1px solid #c8c7cc;
			    color:#333;
			}
			
			#arrowdown{
				width: 100%;
			    text-align: center;
			    border-bottom: 1px solid #c8c7cc;
			}
			
			#keyboard .num{
				width:33.15%;
				padding-top:13px;
				padding-bottom:14px;
				text-align:center;
				float:left;
				color:#333;
			}
			.payment_pwd{width:36px;height:36px;margin-left:0;float:left;color:#333;}
			#main_content{width:78%;height:104px;margin-bottom:80%;border-radius:8px;margin-top:10px;margin:0 auto;position:fixed;top:12%;left:10%;}
			#main_content .mui-input-row{overflow: visible;}
			.payment_password{display: flex;justify-content: center;height:36px;}
		</style>
	</head>

	<body>
		
		<!-- 头部 -->
		<header class="mui-bar mui-bar-nav home_top">
			<h1 class="mui-title">订单确认</h1>
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		</header> 
		<div class="shop-order-address">
			<!--<p class="selecte_address"><span class="mui-icon mui-icon-plusempty"></span> 请先添加收货地址 <i class="mui-icon mui-icon-arrowright"></i></p>-->
		<!--<p>湖南省长沙市天心区芙蓉中路兴威名城 肖智凯 15874017073 <i class="mui-icon mui-icon-arrowright"></i></p>-->
		</div>
		
		<div class="shop-order-main">
			<img src="" id="original_img">
			<div class="shop-order-name">
				<h2 id="goods_name">苹果<!--苹果 iphone7 4G 全网通手机 中国红--></h2>
				<span id="shop_price">47<!--4788--></span>
				<p style="color:#F05A23;padding-left:10px;float:right;font-size:16px;">运费:<font id="shipping_price"></font> 元</p>
			</div>
			<div class="order-numbox">
					<button class="order-num-" type="button" id="plus_num">-</button>
					<input class="order-num-input" value="1" id="goods_num" type="text" readonly="readonly">
					<button class="order-num-add" type="button" id="add_num">+</button>
				</div>
			<div style="clear: both;"></div>
		</div>
		<div>
			
		</div>
		<textarea class="shop-order-remarks" id="remark" placeholder="备注:" lang></textarea>
		
		<div class="order-bottom">
			<div class="order_left">
				<p><span lang>合计：</span><font id="all_money"><!--6688--></font></p>
			</div>
			
			<div class="order_right">
				<a id="do_buy">
					<p><font lang>提交订单</font><br/><span>SUBMIT</span></p>
				</a>
			</div>
		</div>
		
		
		<!--遮罩-->
		<div id="account_pwd" style="z-index:100001; background-color:#000; opacity:0.2; filter:alpha(opacity=40);position: absolute;
		    top: 0;
		    display:none;
		    left: 0;"></div>
			<div class="mui-content" id="main_content" style="z-index: 100002;background-color: #efeff4;height:154px;position: absolute;top:15%;padding-top:0px;display:none;">
		    	<div style="text-align: center;font-size: 16px;height:28px;color:#333;margin-top:2%;border-bottom:1px solid #dca74b;">
		    		<span style="width:70%;float:left;margin-left: 15%;" lang>请输入支付密码</span>
		    	    <span class="mui-icon iconfont icon-guanbi" style="float:right;color:#000;margin-right:2%;" id="close_win"></span>
		    	</div>
			    
			    <div style="text-align: center;height:45px;color:#333;margin-top:2%;">
		    		<span style="width:100%;font-size: 14px;float:left;" id="buyer_name"><!--向 ( 代用名 ) 支付--></span>
		    	    <span style="width:100%;font-size:18px;font-weight:bold;float:left;margin-top: 5px;" id="final_integer"><!--180000--></span>
		    	</div>
		    	
			    <div class="mui-input-row mui-password payment_password" style="margin-top:10px;">
			    	<div style="width:36px;height:36px;margin-left:2%;float:left;color:#333;">
					   <input class="" type="password" value="" style="width:100%;padding:0;text-align:center;" readonly="readonly">
				    </div>
				    
				    <div class="payment_pwd">
					   <input class="" type="password" value="" style="width:100%;padding:0;text-align:center;border-left:0;" readonly="readonly">
				    </div>
				    
				    <div class="payment_pwd">
					   <input class="" type="password" value="" style="width:100%;padding:0;text-align:center;border-left:0;" readonly="readonly">
				    </div>
				    
				    <div class="payment_pwd">
					   <input class="" type="password" value="" style="width:100%;padding:0;text-align:center;border-left:0;" readonly="readonly">
				    </div>
				    
				    <div class="payment_pwd">
					   <input class="" type="password" value="" style="width:100%;padding:0;text-align:center;border-left:0;" readonly="readonly">
				    </div>
				    
				    <div class="payment_pwd">
					   <input class="" type="password" value="" style="width:100%;padding:0;text-align:center;border-left:0;" readonly="readonly">
				    </div>
			    </div>
        	</div>
        	
			<div id="keyboard" style="z-index: 100002;position: absolute;display:none;">
			    	<div id="arrowdown">
			    		<span class="mui-icon mui-icon-arrowdown" style="font-size:26px;padding-top:3px;padding-bottom:3px;"></span>
			    	</div>
			    	<div>
				    	<div id="num1" data-num="1" class="num data_num" style="border-right:1px solid #c8c7cc;">
				    		<span>1</span>
				    	</div>
				    	<div id="num2" data-num="2" class="num data_num" style="border-right:1px solid #c8c7cc;">
				    		<span>2</span>
				    	</div>
				    	<div id="num3" data-num="3" class="num data_num" style="">
				    		<span>3</span>
				    	</div>
				    	
				    	<div id="num4" data-num="4" class="num data_num" style="border-right:1px solid #c8c7cc;border-top:1px solid #c8c7cc;">
				    		<span>4</span>
				    	</div>
				    	<div id="num5" data-num="5" class="num data_num" style="border-right:1px solid #c8c7cc;border-top:1px solid #c8c7cc;">
				    		<span>5</span>
				    	</div>
				    	<div id="num6" data-num="6" class="num data_num" style="border-top:1px solid #c8c7cc;">
				    		<span>6</span>
				    	</div>
				    	
				    	<div id="num7" data-num="7" class="num data_num" style="border-right:1px solid #c8c7cc;border-top:1px solid #c8c7cc;">
				    		<span>7</span>
				    	</div>
				    	<div id="num8" data-num="8" class="num data_num" style="border-right:1px solid #c8c7cc;border-top:1px solid #c8c7cc;">
				    		<span>8</span>
				    	</div>
				    	<div id="num9" data-num="9" class="num data_num" style="border-top:1px solid #c8c7cc;">
				    		<span>9</span>
				    	</div>
				    	
				    	<div class="num" style="border-right:1px solid #c8c7cc;border-top:1px solid #c8c7cc;background-color:rgb(224,224,224);">
				    		<span>&nbsp;</span>
				    	</div>
				    	<div id="num0" data-num="0" class="num data_num" style="border-right:1px solid #c8c7cc;border-top:1px solid #c8c7cc;">
				    		<span>0</span>
				    	</div>
				    	<div id="numC" data-num="C" class="num" style="border-top:1px solid #c8c7cc;background-color:rgb(224,224,224);padding-top: 13px;
    						padding-bottom: 5px;">
				    		<div><span class="mui-icon iconfont icon-weibiaoti-" ></span></div>
				    	</div>
				    	
			    	</div>
			</div>
			
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/config.js"></script>
		<script src="../../js/common.js"></script>
		<script src="../../js/sockjs.js"></script>
		<script src="../../resource/store/order.js"></script>
		<script src="../../lang/shop.js"></script>
		
	</body>

</html>